import { Button, Card, Col, Row, Space } from 'antd';
import { useEffect, useState } from 'react';
import { request } from 'umi'

export default function IndexPage() {


  const style = { padding: '8px 0', background: "white" };
  const container = { padding: "20px 60px", height: "100vh" }
  const red = { background: "#aaa"}

  const [list, setList] = useState([]);
  const arr = [];
  useEffect(() => {
    request("http://www.young1024.com:1717/v1/table/list").then(
      (res) => {
        console.log(res.data);
        setList(res.data)
      },
      (err) => { console.log("失败", err); }
    )
  }, [])

  return (
    <>
      {/* <h1 className={styles.title}>Page index11111</h1>

      <Button type="dashed">change</Button> */}
      <div style={container}>
        <Row gutter={[16, 24]}>
          {list.map((item) => {
            return (
              <Col span={6} key={item._id}>
                <Card title={item.name} bordered={true} hoverable style={item.flag ? red : {}}>
                  {item.flag ? "已订" : "空闲"}
                </Card>
              </Col>
            )
          })}
        </Row>
      </div>
    </>
  );
}
